<%-- 
  - Author: Jordi Vilaplana Mayoral <jvilaplana@alumnes.udl.cat>
  - Date: 05/04/2011
  - 
  - LocationManager
  - Copyright (C) 2011 Jordi Vilaplana Mayoral
  -
  - This program is free software: you can redistribute it and/or modify
  - it under the terms of the GNU General Public License as published by
  - the Free Software Foundation, either version 3 of the License, or
  - (at your option) any later version.
  -
  - This program is distributed in the hope that it will be useful,
  - but WITHOUT ANY WARRANTY; without even the implied warranty of
  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  - GNU General Public License for more details.
  -
  - You should have received a copy of the GNU General Public License
  - along with this program.  If not, see <http://www.gnu.org/licenses/>.
  - 
  - @(#)
  - Description: This program allows users to book rooms and schedule activities
  --%>

<%@ page pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<h2>Modificació d'espais</h2>

<c:choose>
  <c:when test="${requestScope.success == true}">
    <p class="info" id="modifyLocSuccess" onclick="$('modifyLocSuccess').hide();">Espai '<b><i><c:out value="${requestScope.publicName}" /></i></b>' modificat correctament.</p>
  </c:when>
</c:choose>

<div class="modifyLocation">

  <div class="locationList">
    <h3>Llista d'espais</h3>
    <select class="locationList" id="locationList" name="location" onchange="getLocationDetails();">
    </select>
  </div>

  <div class="locationDetails">
    <form class="modLoc" action="ModifyLocation" method="post">

      <div class="simpleDetails">
        <h3>Detalls de l'espai</h3>

        <input id="locationId" type="hidden" name="locationId" value="" />
        <label for="publicName">Nom:</label> <input id="publicName" name="publicName" type="text" />
        <br /><br />
        <label for="roomTypeId">Tipus:</label>
        <select style="border:0px;" id="roomTypeId" name="roomTypeId">
        </select>
        <br /><br />
        <label for="capacity">Capacitat:</label> <input id="capacity" name="capacity" type="text" />

      </div>

      <div class="equipDetails">
        <h4>Equipaments de l'espai</h4>
        <select class="equipmentList" multiple id="equipmentList" name="equipmentList">
        </select>
      </div>

      <input class="modifyLocation" type="submit" value="Edita espai" />

    </form>

  </div>

</div>

<script>
  
  new Ajax.Request('GetRoomTypes', { method:'get', onSuccess: function(transport, json) {
      var response = transport.responseText;
      json = response.toJSON();
      var data = json.evalJSON();

      data.each(function(roomType) {
        var newElement = '<option value="' + roomType.roomTypeId + '">' + roomType.typeName + '</option>';
        var newContent = ${'roomTypeId'}.innerHTML + newElement;
  ${'roomTypeId'}.update(newContent);
        });

      }
    });

    new Ajax.Request('GetLocations', { method:'get', onSuccess: function(transport, json) {
        var response = transport.responseText;
        json = response.toJSON();
        var data = json.evalJSON();

        data.each(function(location) {
          var newElement = '<option value="' + location.locationId + '">' + location.publicName + '</option>';
          var newContent = ${'locationList'}.innerHTML + newElement;
  ${'locationList'}.update(newContent);
          getLocationDetails();
        });
  ${'locationList'}.size = 15;
              
      }
    });

    new Ajax.Request('GetEquipments', { method:'get', onSuccess: function(transport, json) {
        var response = transport.responseText;
        json = response.toJSON();
        var data = json.evalJSON();

        data.each(function(equipment) {
          var newElement = '<option value="' + equipment.equipmentId + '">' + equipment.publicName + '</option>';
          var newContent = ${'equipmentList'}.innerHTML + newElement;
  ${'equipmentList'}.update(newContent);
        });
  ${'equipmentList'}.size = 15;

      }
    });

    function getLocationDetails() {

      var selectedOption = $$('#locationList option').find(function(ele){return !!ele.selected});
      var id = selectedOption.value;

      new Ajax.Request('GetLocation', { method:'get', parameters:{'locationId':id}, onSuccess: function(transport, json) {
          var response = transport.responseText;
          json = response.toJSON();
          var data = json.evalJSON();

  ${'publicName'}.value = data.publicName;
  ${'roomTypeId'}.value = data.roomTypeId;
  ${'capacity'}.value = data.capacity;
  ${'locationId'}.value = data.locationId;


          var options = $$('select#equipmentList option');
          var len = options.length;
          for (var i = 0; i < len; i++) {
            options[i].selected = false;
          }

          data.equipments.each(function(equipment) {

            for (var i = 0; i < len; i++) {
              if(options[i].value == equipment.equipmentId) options[i].selected = true;
            }

          });

        }
      });
    }

</script>